<template>
  <div id="GrandFather">
   <father></father>   
33
  </div>
  
</template>

<script>
import {ref ,provide} from "vue"
import Father from './Father.vue'
export default {
    name:"GrandFather",
    setup(){
        let name=ref("GrandFather")
        provide("name",name)
        return{
            name
        }
    },
    components:{
        Father
        
    }
}
</script>

<style scoped>
#GrandFather{
    width: 500px;
    height: 500px;
    background-color: red;
}
</style>